{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Python API to EasyForm"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from beakerx import *"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "f = EasyForm(\"Form and Run\")\n",
    "f.addTextField(\"first\")\n",
    "f['first'] = \"First\"\n",
    "f.addTextField(\"last\")\n",
    "f['last'] = \"Last\"\n",
    "f.addButton(\"Go!\", tag=\"run\")\n",
    "f"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "You can access the values from the form by treating it as an array indexed on the field names:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "tags": [
     "run"
    ]
   },
   "outputs": [],
   "source": [
    "\"Good morning \" + f[\"first\"] + \" \" + f[\"last\"]"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "f['last'][::-1] + '...' + f['first']"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The array works both ways, so you set default values on the fields by writing the array:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "f['first'] = 'Beaker'\n",
    "f['last'] = 'Berzelius'"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Event Handlers for Smarter Forms\n",
    "\n",
    "You can use `onInit` and `onChange` to handle component events. For button events use `actionPerformed` or `addAction`."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import operator\n",
    "\n",
    "f1 = EasyForm(\"OnInit and OnChange\")\n",
    "f1.addTextField(\"first\", width=15)\n",
    "f1.addTextField(\"last\", width=15)\\\n",
    "    .onInit(lambda: operator.setitem(f1, 'last', \"setinit1\"))\\\n",
    "    .onChange(lambda text: operator.setitem(f1, 'first', text + ' extra'))\n",
    "\n",
    "button = f1.addButton(\"action\", tag=\"action_button\")\n",
    "button.actionPerformed = lambda: operator.setitem(f1, 'last', 'action done')\n",
    "f1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "tags": [
     "action_button"
    ]
   },
   "outputs": [],
   "source": [
    "f1['last'] + \", \" + f1['first']"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "f1['last'] = 'new Value'"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "f1['first'] = 'new Value2'"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## All Kinds of Fields"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "g = EasyForm(\"Field Types\")\n",
    "g.addTextField(\"Short Text Field\", width=10)\n",
    "g.addTextField(\"Text Field\")\n",
    "g.addPasswordField(\"Password Field\", width=10)\n",
    "g.addTextArea(\"Text Area\")\n",
    "g.addTextArea(\"Tall Text Area\", 10, 5)\n",
    "g.addCheckBox(\"Check Box\")\n",
    "options = [\"a\", \"b\", \"c\", \"d\"]\n",
    "g.addComboBox(\"Combo Box\", options)\n",
    "g.addComboBox(\"Combo Box editable\", options, editable=True)\n",
    "\n",
    "g.addList(\"List\", options)\n",
    "g.addList(\"List Single\", options, multi=False)\n",
    "g.addList(\"List Two Row\", options, rows=2)\n",
    "\n",
    "g.addCheckBoxes(\"Check Boxes\", options)\n",
    "g.addCheckBoxes(\"Check Boxes H\", options, orientation=EasyForm.HORIZONTAL)\n",
    "\n",
    "g.addRadioButtons(\"Radio Buttons\", options)\n",
    "g.addRadioButtons(\"Radio Buttons H\", options, orientation=EasyForm.HORIZONTAL)\n",
    "\n",
    "g.addDatePicker(\"Date\")\n",
    "\n",
    "g.addButton(\"Go!\", tag=\"run2\")\n",
    "g"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "tags": [
     "run2"
    ]
   },
   "outputs": [],
   "source": [
    "result = dict()\n",
    "for child in g:\n",
    "    result[child] = g[child]\n",
    "\n",
    "TableDisplay(result)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Dates"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "gdp = EasyForm(\"Field Types\")\n",
    "gdp.addDatePicker(\"Date\")\n",
    "gdp"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "gdp['Date']"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### SetData"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "easyForm = EasyForm(\"Field Types\")\n",
    "easyForm.addDatePicker(\"Date\", value=datetime.today().strftime('%Y%m%d'))\n",
    "easyForm"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "### Default Values and placeholder"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "h = EasyForm(\"Default Values\")\n",
    "h.addTextArea(\"Default Value\", value = \"Initial value\")\n",
    "h.addTextArea(\"Place Holder\", placeholder = \"Put here some text\")\n",
    "h.addCheckBox(\"Default Checked\", value = True)\n",
    "h.addButton(\"Press\", tag=\"check\")\n",
    "h"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "tags": [
     "check"
    ]
   },
   "outputs": [],
   "source": [
    "result = dict()\n",
    "for child in h:\n",
    "    result[child] = h[child]\n",
    "\n",
    "TableDisplay(result)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## JupyterJSWidgets work with EasyForm\n",
    "\n",
    "The widgets from JupyterJSWidgets are compatible and can appear in forms."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from ipywidgets import * \n",
    "\n",
    "w = IntSlider()\n",
    "\n",
    "widgetForm = EasyForm(\"python widgets\")\n",
    "widgetForm.addWidget(\"IntSlider\", w)\n",
    "widgetForm.addButton(\"Press\", tag=\"widget_test\")\n",
    "widgetForm"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "tags": [
     "widget_test"
    ]
   },
   "outputs": [],
   "source": [
    "widgetForm['IntSlider']"
   ]
  }
 ],
 "metadata": {
  "celltoolbar": "Tags",
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.6.5"
  },
  "toc": {
   "base_numbering": 1,
   "nav_menu": {},
   "number_sections": false,
   "sideBar": false,
   "skip_h1_title": false,
   "title_cell": "Table of Contents",
   "title_sidebar": "Contents",
   "toc_cell": false,
   "toc_position": {},
   "toc_section_display": false,
   "toc_window_display": false
  }
 },
 "nbformat": 4,
 "nbformat_minor": 1
}
